import 'package:flutter/material.dart';

import 'package:get/get.dart';

import '../controllers/login_controller.dart';

class LoginView extends GetView<LoginController> {
  @override
  Widget build(BuildContext context) {
    // print('***********是否是平板*************');
    bool isPad = context.isTablet;
    Size size = MediaQuery.of(context).size;
    return Scaffold(
      resizeToAvoidBottomInset: false,
      appBar: AppBar(
        title: Text('登录'),
        centerTitle: true,
      ),
      body: GestureDetector(
        behavior: HitTestBehavior.translucent,
        onTap: () {
          FocusScope.of(context).requestFocus(FocusNode());
        },
        child: GetBuilder<LoginController>(
          id: 'isLoading',
          init: controller,
          builder: (_) {
            if (controller.isLoading) {
              return Center(child: CircularProgressIndicator());
            } else {
              return Center(
                child: Container(
                  width: size.width * (isPad ? 0.7 : 0.93),
                  height: size.height * 1,
                  child: ListView(
                    children: <Widget>[
                      Container(
                        padding: EdgeInsets.only(
                            top: size.height * 0.12, bottom: 10.0),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Text(
                              '校园助手',
                              style: TextStyle(
                                color: Color.fromARGB(255, 53, 53, 53),
                                fontSize: 50.0,
                              ),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        padding: EdgeInsets.all(16.0),
                        child: Form(
                          autovalidateMode: AutovalidateMode.disabled,
                          key: controller.loginKey,
                          child: Column(
                            children: <Widget>[
                              Container(
                                padding: EdgeInsets.fromLTRB(13, 0, 10, 0),
                                decoration: BoxDecoration(
                                  borderRadius:
                                      BorderRadius.all(Radius.circular(30)),
                                  color: Color(0xFFF2F3F7),
                                ),
                                child: TextFormField(
                                  autovalidateMode: AutovalidateMode.disabled,
                                  controller: controller.username,
                                  style: TextStyle(fontSize: 20.0),
                                  maxLength: 16,
                                  decoration: InputDecoration(
                                    icon:
                                        Icon(Icons.person, color: Colors.black),
                                    hintText: '请输入学号',
                                    border: InputBorder.none,
                                    counter: SizedBox(),
                                  ),
                                  validator: (value) {
                                    return value!.trim().isNotEmpty
                                        ? null
                                        : "学号不能为空";
                                  },
                                ),
                              ),
                              SizedBox(height: size.height * 0.02),
                              Container(
                                  padding: EdgeInsets.fromLTRB(13, 0, 10, 0),
                                  decoration: BoxDecoration(
                                    color: Color(0xFFF2F3F7),
                                    borderRadius:
                                        BorderRadius.all(Radius.circular(30)),
                                  ),
                                  child: GetBuilder<LoginController>(
                                    id: 'isShowPassWord',
                                    init: controller,
                                    builder: (_) => TextFormField(
                                      autovalidateMode:
                                          AutovalidateMode.disabled,
                                      controller: controller.password,
                                      style: TextStyle(fontSize: 20.0),
                                      maxLength: 16,
                                      decoration: InputDecoration(
                                        icon: Icon(Icons.lock,
                                            color: Colors.black),
                                        hintText: '请输入密码',
                                        border: InputBorder.none,
                                        suffixIcon: IconButton(
                                          icon: Icon(
                                            controller.isShowPassWord
                                                ? Icons.visibility
                                                : Icons.visibility_off,
                                            color: Colors.black54,
                                          ),
                                          onPressed: controller.showPassWord,
                                        ),
                                        counter: SizedBox(),
                                      ),
                                      obscureText: !controller.isShowPassWord,
                                      validator: (value) {
                                        return value!.trim().isNotEmpty
                                            ? null
                                            : "密码不能为空";
                                      },
                                    ),
                                  )),
                              Container(
                                  height: 45.0,
                                  margin: EdgeInsets.only(top: 40.0),
                                  child: SizedBox.expand(
                                      child: ElevatedButton(
                                        onPressed: controller.handleLogin,
                                        child: Text(
                                          '登录',
                                          style: TextStyle(
                                            fontSize: 18.0,
                                            color:
                                                Color.fromARGB(255, 255, 255, 255),
                                          ),
                                        ),
                                        style: ElevatedButton.styleFrom(
                                          shape: RoundedRectangleBorder(
                                            borderRadius:
                                                BorderRadius.circular(45.0),
                                          ),
                                        ),
                                      )
                                  )
                              ),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              );
            }
          },
        ),
      ),
    );
  }
}
